<!-- 搜索记录 -->
<template>
  <div>
    <van-cell title="搜索记录">
      <span @click="cleanAll"> 清空 </span>
    </van-cell>

    <van-cell
      v-for="(item, index) in SearchRecords"
      :key="index"
      :title="item"
      center
      @click="searchArticle(item)"
    >
      <van-icon name="close" @click.stop="deleteRecord(index)" />
    </van-cell>
  </div>
</template>

<script>
import { setItem } from "../../../utils/storage.js";
export default {
  name: "SearchRecord",
  props: ["SearchRecords"],
  data() {
    return {};
  },
  methods: {
    deleteRecord(index) {
      this.SearchRecords.splice(index, 1);
      setItem("SearchRecords", this.SearchRecords);
    },
    searchArticle(searchText) {
      this.$emit("search", searchText);
    },
    cleanAll() {
      this.SearchRecords.splice(0, this.SearchRecords.length);
      setItem("SearchRecords", this.SearchRecords);
    },
  },
};
</script>
<style lang= "less" scoped>
</style>